394. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2021-05-13 09:09:21 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

394.1 Files compared

#LocationFileLast Modified
1/Applications/Ampps/www/Porto 3.2.2/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Magento_Checkout/web/css/source/module_minicart.less2016-06-22 23:45:34 +0000
2/Applications/Ampps/www/Porto v4.0.0/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Magento_Checkout/web/css/source/module_minicart.less2021-02-15 04:16:32 +0000

394.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged31602
Changed983
Inserted339
Removed1893

394.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

394.4 Active regular expressions

No regular expressions were active.

394.5 Comparison detail

1 // /** 1 // /**
2 //  * Copyright © 2015 Magento. All rights reserved. 2 //  * Copyright © 2015 Magento. All rights reserved.
3 //  * See COPYING.txt for license details. 3 //  * See COPYING.txt for license details.
4 //  */ 4 //  */
5  5 
6 // 6 //
7 //  Variables 7 //  Variables
8 //  _____________________________________________ 8 //  _____________________________________________
9  9 
10 @minicart__padding-horizontal: @indent__base; 10 @minicart__padding-horizontal: @indent__base;
11  11 
12 @minicart-qty__height: 24px; 12 @minicart-qty__height: 24px;
13  13 
14 // 14 //
15 //  Common 15 //  Common
16 //  _____________________________________________ 16 //  _____________________________________________
17  17 
18 & when (@media-common = true) { 18 & when (@media-common = true) {
19  19 
20     // 20     //
21     //  Minicart 21     //  Minicart
22     //  --------------------------------------------- 22     //  ---------------------------------------------
23  23 
24     .block-minicart { 24     .block-minicart {
25         .items-total { 25         .items-total {
26             float: left; 26             float: left;
27             margin-top: 20px;    
28             .count { 27             .count {
29                 font-weight: @font-weight__bold; 28                 font-weight: @font-weight__bold;
30                 color: #000; 29                 color: #000;
31             } 30             }
32         } 31         }
33         .subtotal { 32         .subtotal {
34             text-align: right; 33             text-align: right;
35             .label { 34             .label {
36                 &:extend(.abs-colon all); 35                 &:extend(.abs-colon all);
37             } 36             }
38         } 37         }
39         .amount {    
40             .price-wrapper {    
41                 color: #000;    
42                 &:first-child {    
43                     .price {    
44                         font-size: @font-size__l;    
45                         font-weight: @font-weight__bold;    
46                     }    
47                 }    
48             }    
49         }    
50         .subtitle { 38         .subtitle {
51             display: none; 39             display: none;
52             &.empty { 40             &.empty {
53                 display: block; 41                 display: block;
54                 padding: @indent__l 0 @indent__base; 42                 padding: 18px 0;
55                 text-align: center; 43                 text-align: center;
56                 font-size: 13px; 44                 font-size: inherit;
57                 font-weight: 400; 45                 font-weight: 400;
58             } 46             }
59         } 47         }
60         .text { 48         .text {
61             &.empty { 49             &.empty {
62                 text-align: center; 50                 text-align: center;
63             } 51             }
64         } 52         }
65         .block-content { 53         .block-content {
66             > .actions { 54             > .actions {
67                 margin-top: 15px;    
68                 > .secondary { 55                 > .secondary {
69                     text-align: center; 56                     text-align: center;
70                     margin: 0 0 15px; 57                     margin: 0 0 15px;
71                     .action { 58                     .action {
72                         &.viewcart { 59                         &.viewcart {
73                             display: block; 60                             display: block;
74                             width: 100%; 61                             width: 100%;
75                             padding: 10px 15px; 62                             padding: 10px 15px;
76                             text-transform: uppercase; 63                             text-transform: uppercase;
77                             font-size: 15px; 64                             font-size: 15px;
78                             border: 1px solid #ccc; 65                             border: 1px solid #ccc;
79                             border-radius: 3px; 66                             border-radius: 3px;
80                         } 67                         }
81                     } 68                     }
82                 } 69                 }
83                 > .primary {    
84                     margin: 0 0 15px;    
85                     .action {    
86                         &.primary {    
87                             &:extend(.abs-button-l all);    
88                             display: block;    
89                             width: 100%;    
90                             padding: 10px 15px;    
91                             font-weight: 400;    
92                             text-transform: uppercase;    
93                             font-size: 15px;    
94                         }    
95                     }    
96                 }    
97                 .paypal-logo { 70                 .paypal-logo {
98                     margin-top: 15px; 71                     margin-top: 15px;
99                     text-align: center; 72                     text-align: center;
100                 } 73                 }
101             } 74             }
102         } 75         }
103         .block-category-link, 76         .block-category-link,
104         .block-product-link, 77         .block-product-link,
105         .block-cms-link, 78         .block-cms-link,
106         .block-banners { 79         .block-banners {
107             margin: 15px 0 0; 80             margin: 15px 0 0;
108             text-align: center; 81             text-align: center;
109         } 82         }
110     } 83     }
111  84 
112     .minicart-wrapper { 85     .minicart-wrapper {
113         .lib-dropdown( 86         .lib-dropdown(
114             @_toggle-selector: ~".action.showcart", 87             @_toggle-selector: ~".action.showcart",
115             @_options-selector: ~".block-minicart", 88             @_options-selector: ~".block-minicart",
116             @_dropdown-toggle-icon-content: @icon-mini-cart, 89             @_dropdown-toggle-icon-content: @icon-mini-cart,
117             @_dropdown-toggle-active-icon-content: @icon-mini-cart, 90             @_dropdown-toggle-active-icon-content: @icon-mini-cart,
118             @_dropdown-list-item-padding: false, 91             @_dropdown-list-item-padding: false,
119             @_dropdown-list-item-hover: false, 92             @_dropdown-list-item-hover: false,
120             @_dropdown-list-margin-top: 7px, 93             @_dropdown-list-margin-top: 7px,
121             @_dropdown-list-border: 0, 94             @_dropdown-list-border: 0,
122             @_dropdown-list-pointer-position-top: -21px, 95             @_dropdown-list-pointer-position-top: -21px,
123             @_icon-font-position: before, 96             @_icon-font-position: before,
124             @_icon-font-size: 35px, 97             @_icon-font-size: 26px,
125             @_icon-font-line-height: 33px, 98             @_icon-font-line-height: 33px,
126             @_icon-font-color: @minicart-icons-color, 99             @_icon-font-color: @minicart-icons-color,
127             @_icon-font-color-hover: @minicart-icons-color-hover, 100             @_icon-font-color-hover: @minicart-icons-color-hover,
128             @_icon-font-color-active: @minicart-icons-color 101             @_icon-font-color-active: @minicart-icons-color
129         ); 102         );
130         .block-minicart { 103         .block-minicart {
131             .lib-css(padding, 25px @minicart__padding-horizontal); 104             .lib-css(padding, 15px @minicart__padding-horizontal);
132             width: 320px; 105             width: 300px;
133             right: -15px; 106             left: 0;
134             border-top: 6px solid @theme-color; 107             color: #222529;
135             color: @minicart__text-color; 108             top: 100%;
136             & when (@enable_border_radius = true) { 109             margin-top: 13px;
137                 border-radius: 8px; 110             box-shadow: 0 
5px 8px rgba(0,0,0,
.15);
138             }    
139             box-shadow: 0 5px 
rgba(0,0,0,0.25);
    
140             .block-title { 111             .block-title {
141                 display: none; 112                 display: none;
142             } 113             }
143             &:after { 114             &:before, &::after {display: none;}
144                 right: auto;    
145                 left: 25px;    
146                 border: 9px solid;    
147                 border-color: transparent transparent rgba(0,0,0,0.1) transparent;    
148             }    
149             &:before {    
150                 right: auto;    
151                 left: 26px;    
152                 border: 8px solid;    
153                 border-color: transparent transparent @theme-color transparent;    
154             }    
155         } 115         }
156         .product { 116         .product {
157             .actions { 117             .actions {
158                 float: left;    
159                 margin: -30px 0 0;    
160                 > .primary, 118                 > .primary,
161                 > .secondary { 119                 > .secondary {
162                     display: inline; 120                     display: inline;
163                     &:not(:last-child) {    
164                         margin-left: 15px;    
165                     }    
166                 } 121                 }
167             } 122             }
168         } 123         }
169         .action { 124         .action {
170             &.close { 125             &.close {
171                 width: 40px; 126                 width: 40px;
172                 height: 40px; 127                 height: 40px;
173                 top: 0; 128                 top: 0;
174                 left: 0; 129                 left: 0;
175                 position: absolute; 130                 position: absolute;
176                 .lib-button-reset(); 131                 .lib-button-reset();
177                 .lib-button-icon( 132                 .lib-button-icon(
178                     @icon-remove, 133                     @icon-remove,
179                     @_icon-font-color: #777, 134                     @_icon-font-color: #777,
180                     @_icon-font-size: 16px, 135                     @_icon-font-size: 16px,
181                     @_icon-font-line-height: 16px, 136                     @_icon-font-line-height: 16px,
182                     @_icon-font-text-hide: true 137                     @_icon-font-text-hide: true
183                 ); 138                 );
184             } 139             }
185             &.showcart { 140             &.showcart {
186                 white-space: nowrap; 141                 white-space: nowrap;
    142                 display: flex;
    143                 align-items: center;
    144                 position: relative;
    145                 &.active {
    146                   display: flex;
    147                   align-items: center;
    148                   .minicart-icon {
    149                     &::after {
    150                       content: "";
    151                       border-width: 1px 1px 0 0;
    152                       border-color: #f4f4f4;
    153                       border-style: solid;
    154                       background: #fff;
    155                       width: 14px;
    156                       height: 14px;
    157                       position: absolute;
    158                       top: calc(100%);
    159                       left: 50%;
    160                       margin-top: 8px;
    161                       margin-left: -7px;
    162                       transform: rotate(-45deg);
    163                       z-index: 1004;
    164                       animation: arrowFadeInDown .2s ease-out;
    165                     }
    166                   }
    167                 }
    168                 .minicart-icon {
    169                   font-size: 26px;
    170                   position: relative;
    171                   &::before {margin: 0;}
    172                 }
187                 .text { 173                 .text {
188                     &:extend(.abs-visually-hidden all); 174                     &:extend(.abs-visually-hidden all);
189                 } 175                 }
190                 .counter.qty { 176                 .counter.qty {
191                     color: @minicart__qty_color; 177                     color: @minicart__qty_color;
192                     .lib-css(height, @minicart-qty__height);    
193                     .lib-css(line-height, @minicart-qty__height);    
194                     border-radius: 2px;    
195                     display: inline-block;    
196                     margin: -11px 0 0;    
197                     min-width: 18px;    
198                     width: 100%;    
199                     overflow: hidden;    
200                     padding: 0 3px;    
201                     text-align: center;    
202                     white-space: normal;    
203                     position: absolute; 178                     position: absolute;
204                     top: 50%; 179                     left: 18px;
205                     right: 0; 180                     top: -5px;
    181                     font-size: 10px;
206                     font-weight: 600; 182                     font-weight: 600;
207                     font-size: 14px; 183                     text-align: center;
    184                     width: 16px;
    185                     height: 16px;
    186                     line-height: 16px;
    187                     border-radius: 8px;
    188                     overflow: hidden;
    189                     color: #fff;
    190                     background-color: #ff5b5b;
    191                     padding: 0;
208                     .loader { 192                     .loader {
209                         > img { 193                         > img {
210                             .lib-css(max-width, @minicart-qty__height); 194                             .lib-css(max-width, @minicart-qty__height);
211                         } 195                         }
212                     } 196                     }
213                 } 197                 }
214                 .counter-label { 198                 .counter-label {
215                     &:extend(.abs-visually-hidden all); 199                     &:extend(.abs-visually-hidden all);
216                 } 200                 }
217                 &:before, &.active:before { 201                 &:before, &.active:before {
218                     color: @minicart__icon_color; 202                     color: @minicart__icon_color;
219                     line-height: 40px; 203                     line-height: 40px;
220                     margin: 0; 204                     margin: 0;
    205                     display: none;
221                 } 206                 }
222                 &:hover:before, &:active:before, &.active:before, &.active:hover:before { 207                 &:hover:before, &:active:before, &.active:before, &.active:hover:before {
223                     color: @minicart__icon_color; 208                     color: @minicart__icon_color;
224                 } 209                 }
    210                 &::after {
    211                   content: "\e81c";
    212                   font-family: 'porto-icons';
    213                   font-size: 17px;
    214                   margin-right: 15px;
    215                   display: block;
    216                 }
225             } 217             }
226         } 218         }
227         .minicart-widgets { 219         .minicart-widgets {
228             margin-top15px; 220             padding: 0 10px 0;
    221         }
    222     }
    223     .cart-design-2 {
    224       .action {
    225         &.showcart {
    226           .minicart-icon {
    227             width: 25px;
    228             height: 20px;
    229             border: 2px solid #222529;
    230             border-radius: 0 0 5px 5px;
    231             position: relative;
    232             opacity: 1;
    233             margin: 6px 3px 0;
    234             font-size: 32px;
    235             &::before {
    236               content: '';
    237               position: absolute;
    238               border: 2px solid;
    239               border-color: inherit;
    240               border-bottom: none;
    241               border-radius: 10px 10px 0 0;
    242               left: 50%;
    243               top: -8px;
    244               margin-left-7.5px;
    245               width: 15px;
    246               height: 11px;
    247             }
    248           }
    249         }
229         } 250       }
230     } 251     }
231     
232     .minicart-items-wrapper { 252     .minicart-items-wrapper {
233         .lib-css(margin, 0 -15px);    
234         overflow-x: auto; 253         overflow-x: auto;
235         padding: 15px;    
236     } 254     }
237  255 
238     .minicart-items { 256     .minicart-items {
239         .lib-list-reset-styles(); 257         .lib-list-reset-styles();
240         .product-item { 258         .product-item {
241             &:not(:first-child) {    
242                 .lib-css(border-top, 1px solid @minicart__border-color);    
243             }    
244             padding: @indent__base 0;    
245             &:first-child {    
246                 padding-top: 0;    
247             }    
248             > .product { 259             > .product {
249                 &:extend(.abs-add-clearfix all); 260                 &:extend(.abs-add-clearfix all);
250             } 261             }
251         } 262         }
252         .product-image-wrapper { 263         .product-image-wrapper {
253             &:extend(.abs-reset-image-wrapper all); 264             &:extend(.abs-reset-image-wrapper all);
254         } 265         }
255         .product-item-pricing { 266         .product-item-pricing {
256             .label { 267             .label {
257                 display: inline-block; 268                 display: inline-block;
258                 width: 4.5rem;    
259             } 269             }
260         } 270         }
261         .price-minicart { 271         .price-minicart {
262             margin-bottom: @indent__xs; 272             margin-bottom: @indent__xs;
263         } 273         }
264         .product-item-name {    
265             font-size: 14px;    
266             font-weight: @font-weight__regular;    
267             margin: 0 0 @indent__s;    
268             a {    
269                 .lib-css(color, @link__color);    
270             }    
271         }    
272         .product-item-details { 274         .product-item-details {
273             padding-right: 95px;    
274             text-align: right; 275             text-align: right;
275             .price {    
276                 font-weight: @font-weight__bold;    
277                 color: #000;    
278             }    
279             .price-including-tax, 276             .price-including-tax,
280             .price-excluding-tax { 277             .price-excluding-tax {
281                 margin: @indent__xs 0; 278                 margin: @indent__xs 0;
282             } 279             }
283             .weee[data-label] { 280             .weee[data-label] {
284                 .lib-font-size(11); 281                 .lib-font-size(11);
285                 .label { 282                 .label {
286                     &:extend(.abs-no-display all); 283                     &:extend(.abs-no-display all);
287                 } 284                 }
288             } 285             }
289             .details-qty { 286             .details-qty {
290                 margin-top: @indent__s; 287                 margin-top: @indent__s;
291             } 288             }
292         } 289         }
293         .product { 290         .product {
294             > .product-item-photo, 291             > .product-item-photo,
295             > .product-image-container { 292             > .product-image-container {
296                 float: right; 293                 float: right;
297                 min-width: 0; 294                 min-width: 0;
298             } 295             }
299             .toggle { 296             .toggle {
300                 &:after { 297                 &:after {
301                     position: static; 298                     position: static;
302                     margin: 0 @indent__x0 0
;
 299                     margin: 0 
0 0 @indent__xs;
303                     .lib-css(color, @color-gray56); 300                     .lib-css(color, @color-gray56);
304                 } 301                 }
305                 border: 0; 302                 border: 0;
306                 padding: 0 0 @indent__xs @indent__xl; 303                 padding: 0 0 @indent__xs @indent__xl;
307             } 304             }
308             .product.options { 305             .product.options {
309                 > .toggle { 306                 > .toggle {
310                     &:after { 307                     &:after {
311                         font-family: @icon-font-family; 308                         font-family: @icon-font-family;
312                     } 309                     }
313                     .lib-icon-font-symbol( 310                     .lib-icon-font-symbol(
314                         @_icon-font-content: @icon-down, 311                         @_icon-font-content: @icon-down,
315                         @_icon-font-position: after 312                         @_icon-font-position: after
316                     ); 313                     );
317                 } 314                 }
318                 &.active { 315                 &.active {
319                     > .toggle { 316                     > .toggle {
320                         .lib-icon-font-symbol( 317                         .lib-icon-font-symbol(
321                             @_icon-font-content: @icon-up, 318                             @_icon-font-content: @icon-up,
322                             @_icon-font-position: after 319                             @_icon-font-position: after
323                         ); 320                         );
324                     } 321                     }
325                 } 322                 }
326             } 323             }
327             &.pricing { 324             &.pricing {
328                 margin-top: 3px; 325                 margin-top: 3px;
329             } 326             }
330             &.options { 327             &.options {
331                 .tooltip.toggle { 328                 .tooltip.toggle {
332                     .lib-icon-font( 329                     .lib-icon-font(
333                         @icon-down, 330                         @icon-down,
334                         @_icon-font-size: 12px, 331                         @_icon-font-size: 12px,
335                         @_icon-font-line-height: 12px, 332                         @_icon-font-line-height: 12px,
336                         @_icon-font-text-hide: true, 333                         @_icon-font-text-hide: true,
337                         @_icon-font-margin: -3px 7px 0 0, 334                         @_icon-font-margin: -3px 7px 0 0,
338                         @_icon-font-position: after 335                         @_icon-font-position: after
339                     ); 336                     );
340                 } 337                 }
341                 .details { 338                 .details {
342                     display: none; 339                     display: none;
343                 } 340                 }
344             } 341             }
345         } 342         }
346         .details-qty, 343         .details-qty,
347         .price-minicart { 344         .price-minicart {
348             .label { 345             .label {
349                 &:extend(.abs-colon all); 346                 &:extend(.abs-colon all);
350             } 347             }
351         } 348         }
352         .item-qty { 349         .item-qty {
353             width: 40px; 350             width: 40px;
354             text-align: center; 351             text-align: center;
355             margin-left: @indent__s; 352             margin-left: @indent__s;
356             border-radius: 3px; 353             border-radius: 3px;
357         } 354         }
358         .update-cart-item { 355         .update-cart-item {
359             vertical-align: top; 356             vertical-align: top;
360             .lib-font-size(11); 357             .lib-font-size(11);
361         } 358         }
362         .action {    
363             &.edit,    
364             &.delete {    
365                 .lib-icon-font(    
366                     @icon-edit,    
367                     @_icon-font-size: 18px,    
368                     @_icon-font-line-height: 20px,    
369                     @_icon-font-text-hide: true,    
370                     @_icon-font-color: @minicart-icons-color,    
371                     @_icon-font-color-hover: @minicart-icons-color,    
372                     @_icon-font-color-active: @minicart-icons-color    
373                 );    
374             }    
375             &.delete {    
376                 .lib-icon-font-symbol(    
377                     @_icon-font-content: @icon-trash    
378                 );    
379             }    
380         }    
381         .subtitle { 359         .subtitle {
382             display: none; 360             display: none;
383         } 361         }
384     } 362     }
385  363 
386 } 364 }
387  365 
388 // 366 //
389 //  Mobile 367 //  Mobile
390 //  _____________________________________________ 368 //  _____________________________________________
391  369 
392 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) { 370 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) {
393     .minicart-wrapper .block-minicart { 371     .minicart-wrapper .block-minicart {
394         width: 290px; 372         width: 290px;
395     } 373     }
396 } 374 }
397  375 
398 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {    
399     .minicart-wrapper {    
400         margin-top: @indent__s;    
401     }    
402 }    
403  376 
404  377 
405 // 378 //
406 //  Desktop 379 //  Desktop
407 //  _____________________________________________ 380 //  _____________________________________________
408  381 
409 .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { 382 .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
410     .minicart-wrapper { 383     .minicart-wrapper {
411         .block-minicart { 384         .block-minicart {
412             right: auto; 385             right: auto;
413             left: -15px;    
414             width: 350px;    
415         } 386         }
416     } 387     }
417     .minilist .action.delete, 388     .minilist .action.delete,
418     .minicart-wrapper .action.edit { 389     .minicart-wrapper .action.edit {
419         .lib-icon-font-size( 390         .lib-icon-font-size(
420             @_icon-font-size: 16px 391             @_icon-font-size: 16px
421         ); 392         );
422     } 393     }
423 } 394 }